<template>
  <div class="Song">
    <!-- <h1>歌单</h1> -->
    <loading v-if="songList.length==0"></loading>
    <ul class="ulSong" v-else>
      <song-list 
          v-for="song in songList"
          :key="song.id"
          :song="song"
          path="/playlist"
      ></song-list>
    </ul>
  </div>
</template>

<script>
import SongList from '@/components/SongList.vue'  //歌单列表

export default {
  name: 'song',
  data(){
    return {
      songList:[],  //歌单数据 (此处拿的是 推荐歌单 数据)
    }
  },
  created(){
    this.$axios.get('/personalized').then(result=>{
      this.songList=result;
      // console.log("请求结果",result)  //result=>数组 v-for后 song=>对象
    })
  },
  components: {
    SongList  //歌单下内容组件
  },

}
</script>
<style lang="less" scoped>

</style>
